<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人中心</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <link rel="shortcut icon" href="favicon.ico">
	<link href="https://cdn.jsdelivr.net/gh/bootcdn/BootCDN/ajax/libs/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link href="<%=basePath%>hplus/css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">
    <link href="<%=basePath%>hplus/css/plugins/iCheck/custom.css" rel="stylesheet">
    <link href="<%=basePath%>hplus/css/animate.min.css" rel="stylesheet">
    <link href="<%=basePath%>hplus/css/style.min862f.css?v=4.1.0" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="<%=path%>/hplus/js/plugins/sweetalert/sweetalert2.min.css">
    <style>
        .form-group{
            height: 40px;
            line-height: 40px;
        }
        .form-group .col-sm-1{
            text-align: right;
        }
        .s_box{
            height: 120px;
        }
        .text-navy{
            font-size: 24px;
        }
        .project-status{
            width: 80px;
        }
        .table{
            margin-bottom: 0;
            height: 130px;
        }
        .modal-sm{
            width: 460px;
        }
        .s_input{
            display: none;
        }
        .bj_btn,.qd_btn,.qx_btn{
            cursor: pointer;
        }
        .qd_btn,.qx_btn{
            display: none;
        }
    </style>
</head>

<body class="gray-bg">
    <div class="wrapper wrapper-content">
        <div class="ibox-content">
            <div class="form-group">
                <label class="col-sm-1 control-label">账号</label>
                <div class="col-sm-2">
                    <p id = "P_phone"></p>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-1 control-label">姓名</label>
                <div class="col-sm-2 s_name">
                 <p id ="P_name"></p>
                </div>
                <div class="col-sm-2 s_input">
                   	<input class="s_input_name" maxlength="20" type="text" class="form-control">
                </div>
                <shiro:hasPermission name="setting_personal_center:update_info">
                <img src="<%=basePath%>/hplus/img/bj_icon.png" class="bj_btn">
                </shiro:hasPermission>
                <img src="<%=basePath%>/hplus/img/qd_icon.png" class="qd_btn">
                <img src="<%=basePath%>/hplus/img/qx_icon.png" class="qx_btn">
            </div>
            <div class="form-group">
                <label class="col-sm-1 control-label">邮箱</label>
                <div class="col-sm-2 s_name">
                   <p id = "P_email"></p>
                </div>
                <div class="col-sm-2 s_input">
                   <input class="s_input_email" type="text" class="form-control">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-1 control-label">协议</label>
                <div class="col-sm-2">				
                    <p id = "agreement"><a onclick="parentAgreement();">查看协议</a></p>
                </div>			
            </div>
            <div class="form-group">
                <label class="col-sm-1 control-label">角色</label>
                <div class="col-sm-5">
                    <p id = "P_role"></p>
                </div>
                <br/>
            </div>
            <div class="form-group">
                <label class="col-sm-1 control-label">组织</label>
                <div class="col-sm-5">
                 <p id = "P_Departments">  北京公司-产业部-业务员</p>
                  
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-1 control-label">门店</label>
                <div class="col-sm-5">
                    <p id = "P_store">朝阳分店</p>
                </div>
            </div>
        </div>
        <div class="ibox-content" style="margin-top:20px;padding:0 15px;">
            <div class="project-list">
                <table class="table table-hover">
                    <tbody>
                        <tr>
                            <td class="project-status">
                                <img src="<%=basePath%>/hplus/img/phone.png" />
                            </td>
                            <td class="project-title">
                                <a href="">登录手机号<span class="text-navy" id="login_phone"></span></a>
                                <br>
                                <small>手机号用于登录及登录密码的找回、修改，同时接收重要提醒</small> 
                            </td>
                            <td class="project-actions">
                            	<shiro:hasPermission name="setting_personal_center:update_phone">
                                <button class="btn btn-primary" type="button" data-toggle="modal" data-target="#myModal5">修改</button>
                                </shiro:hasPermission>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="project-list">
                <table class="table table-hover">
                    <tbody>
                        <tr>
                            <td class="project-status">
                                <img src="<%=basePath%>/hplus/img/password.png" />
                            </td>
                            <td class="project-title">
                                <a href="">登录密码<span class="text-navy">******</span></a>
                                <br>
                                <small>不定期修改密码可提高账户安全性</small>
                            </td>
                            <td class="project-actions">
                            	<shiro:hasPermission name="setting_personal_center:update_info">
                                <button class="btn btn-primary" type="button" data-toggle="modal" data-target="#myModal6">修改</button>
                                </shiro:hasPermission>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <!-- 修改手机号 -->
    <div hidden="" class="modal inmodal fade" id="myModal5" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-sm">
            <div class="modal-content">
                <div class="modal-header" style="padding: 15px 15px 10px;">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                    <h4 class="text-left">修改手机</h4>
                </div>
                <div class="text-center" style="width:100%;height:60px;">                    
                    <form method="get" class="form-horizontal col-sm-12" style="margin:20px 0;">
                        <div class="form-group">
                            <label class="col-sm-3 control-label" style="line-height: 24px;">手机号</label>
                            <div class="col-sm-5">
                                <input type="text"  class="form-control" id="old_mobil" onkeyup="value=value.replace(/[^\d]/g,'')" maxlength="11">
                            </div>
                            <input class="btn btn-primary J_xcode" type="button" style="float:left;" value="发送验证码">
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label" onkeyup="value=value.replace(/[^\d]/g,'')" style="line-height: 24px;">验证码</label>
                            <div class="col-sm-5">
                                <input id="old_ver_code" name="name" minlength="2" type="text" onkeyup="value=value.replace(/[^\d]/g,'')" class="form-control" required="" aria-required="true" aria-describedby="cname-error" aria-invalid="true">
                                <span id="cname-error" class="help-block m-b-none" style="display:none;">验证码错误</span>
                            </div>
                        </div>
                    </form>
                </div>
                 <div class="modal-footer" style="text-align:center;border-top:none;">
                     <button type="button" class="btn btn-outline btn-primary" data-dismiss="modal">取消</button>
                     <button type="button" class="btn btn-primary k_verify" id="qd_primary">确定</button>
                 </div>
             </div>
        </div>
    </div> 

    <!-- 修改密码 -->
    <div hidden="" class="modal inmodal fade" id="myModal6" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-sm">
            <div class="modal-content">
                <div class="modal-header" style="padding: 15px 15px 10px;">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                    <h4 class="text-left">修改密码</h4>
                </div>
                <div class="text-center" style="width:100%;height:60px;">                    
                    <form method="get" class="form-horizontal col-sm-12" style="margin:20px 0;">
                        <div class="form-group">
                            <label class="col-sm-3 control-label" style="line-height: 24px;">旧密码</label>
                            <div class="col-sm-7">
                                <input id="old_password" type="password" class="form-control" maxlength="20">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label" style="line-height: 24px;">新密码</label>
                            <div class="col-sm-7">
                                <input id="new_password" type="password" class="form-control" maxlength="20">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label" style="line-height: 24px;">确定密码</label>
                            <div class="col-sm-7">
                                <input id="new_two_password" name="name" minlength="2" type="password" class="form-control" required="" aria-required="true" aria-describedby="cname-error" aria-invalid="true" maxlength="20">
                                <span id="cname-error-password" class="help-block m-b-none" style="display:none">再次密码输入不一致</span>
                            </div>
                        </div>
                    </form>
                </div>
                 <div class="modal-footer" style="text-align:center;border-top:none;">
                     <button type="button" class="btn btn-outline btn-primary" data-dismiss="modal">取消</button>
                     <button type="button" class="btn btn-primary k_verify" id="qd_password">确定</button>
                 </div>
             </div>
        </div>
    </div>

   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
	<script src="https://cdn.jsdelivr.net/gh/bootcdn/BootCDN/ajax/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="<%=basePath%>/hplus/js/content.min.js?v=1.0.0"></script>
    <script type="text/javascript" src="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
    <script src="<%=path%>/hplus/js/plugins/sweetalert/sweetalert2.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/artDialog/7.0.0/dialog-plus.js"></script>
    <script type="text/javascript" src="<%=path%>/js/marketing/dialog.js"></script>
    <script src="<%=path%>/hplus/js/plugins/sweetalert/sweetalert2.min.js"></script>
    <script>  
    var access_token=$.cookie('access_token');
 	var cid=$.cookie('cid');
 	var uid=$.cookie('uid');
 	var login_phone="";
 	var path="<%=path%>";
    $('.J_xcode').click(function(){
    	var flag=true;
    	var msg="";
    	var old_mobil = $('#old_mobil').val();
	    	if(old_mobil==null||old_mobil==""){
	    		msg="手机号不能为空！";
	    		flag=false;
	    	}else if(!/^1[34578]\d{9}$/.test(old_mobil)){
	    		msg="手机号格式不正确！";
	    		flag=false;
	    	}else if(old_mobil==login_phone){
	    		msg="更改手机号码不能为当前登录手机号码！";
	    		flag=false;
	    	}
    	if(flag){
	        var $this = $(this),
	            _this = this,
	            i = 60;

	        var old_mobil = $('#old_mobil').val();	         
	          $.ajax({
	       		  url: "${pageContext.request.contextPath}/smsSend/ajaxSmsSend",
	       		  type: "post",	       		  
	       		  async: true,
	       		  data:{account:old_mobil,codeType:"change_code"},
	       		  dataType: "json",
	       		  timeout: 1000,
	       		  error: function(){},
	       		  success: function(data){
	       			  if(data.status == "40001"){
	       				$("#cname-error").attr("style","display:block;color:red;");
	       	    		$("#cname-error").html(data.message);
	       			  }else{
	       				_this.disabled = 'disabled';
	       				 clearInterval(repeat);
	       				 var repeat = setInterval(function(){
	       		            i--;
	       		            if(i == 0){
	       		                _this.disabled = false;
	       		                $this.removeClass('gray').val('获取验证码');
	       		                clearInterval(repeat);
	       		            }else{
	       		                $this.addClass('gray').val(i+'s后重新获取');
	       		            }
	       		        },1000);
	       				 
	       				$("#cname-error").attr("style","display:none;");
	       			  }
	       			  
	       			
	       		  }                 
	       		  }); 
    	}else{
    		$("#cname-error").attr("style","display:block;color:red;");
    		$("#cname-error").html(msg);
    	}
    });
    $('#qd_primary').click(function(){
        	 //alert("验证进入");
        	 var flag=true;
    		 var msg="";
        	 var old_mobil = $('#old_mobil').val();
        	 var old_ver_code = $('#old_ver_code').val();
 	    	if(old_mobil==null||old_mobil==""){
 	    		msg="手机号不能为空！";
 	    		flag=false;
 	    	}else if(!/^1[34578]\d{9}$/.test(old_mobil)){
 	    		msg="手机号格式不正确！";
 	    		flag=false;
 	    	}
 	    	if(flag){
 	    		if (old_ver_code==null||old_ver_code=="") {
 	    			msg="验证码不能为空！";
 	    			flag=false;
 	    		}
 	    	}
	        if(flag){
	        	 $.ajax({
	        		  url: path+"/smsSend/ajaxSmsVerify",		
	        		  type: "post",		        		  
	        		  async: false,		
	        		  data:{"account":old_mobil,"verCode":old_ver_code,"codeType":"change_code"},		        		  
	        		  cache:false, 		
	        		  dataType: "json",		
	        		  timeout: 1000,		
	        		  error: function(){},		
	        		  success: function(data){
	        			  if (data.status != "200"){
	        				  msg="验证码错误！";
	       	    			  flag=false;
	        			  }
	        		  }
	        	 });
	        }	 
	         if(flag){ 
	        	 $.ajax({
	         		  url: path+"/personal/ajaxUpdateMobile",	
	         		  type: "post",
	         		  async: false,		
	         		  data:{id:userId,account:old_mobil},					         		  
	         		  cache:false, 		
	         		  dataType: "json",		
	         		  timeout: 1000,		
	         		  error: function(){ },					         		  
	         		  success: function(data){
	         			 console.log(data);
	         			if(data.status == "200"){
	         			$("#cname-error").attr("style","display:none;");
		         			if(confirm("修改成功！")){
		         				window.location.reload();
		         			}else{
		         				window.location.reload();
		         			}
	         			}else{
	         				$("#cname-error").attr("style","display:block;color:red;");
	        		    	$("#cname-error").html("修改失败！");
	         			}
                   }
	        	 });
	         }else{
	        	 $("#cname-error").attr("style","display:block;color:red;");
 		    	 $("#cname-error").html(msg);
	         }
		        			
        });
        $('#qd_password').click(function(){
        	var old_password ="";  
			var new_password =""; 
			var new_two_password="";
			var promptMsg="";
			var flag=true;
			if(flag){
				if($('#old_password').val()!=null&&$('#old_password').val().trim()!=""){
					old_password=$('#old_password').val().trim();
				}else{
					promptMsg="旧密码不能为空！";
					flag=false;
				}	
			}
			if(flag){
				if($('#new_password').val()!=null&&$('#new_password').val().trim()!=""){
					new_password=$('#new_password').val().trim();
				}else{
					promptMsg="新密码不能为空！";
					flag=false;
				}	
			}
			if(flag){
				if($('#new_two_password').val()!=null&&$('#new_two_password').val().trim()!=""){
					new_two_password=$('#new_two_password').val().trim();
				}else{
					promptMsg="确认密码不能为空！";
					flag=false;
				}
			}
			if(flag){
				if(new_two_password!=new_password){
					promptMsg="确认密码不一致，请重新输入！";
					flag=false;
				}
			}
			if(flag){
				if(new_password.length<6){
					promptMsg="密码请勿少于6位！";
					flag=false;
				}
			}
			if(flag){
				var reg = new RegExp(/^(?![^a-zA-Z]+$)(?!\D+$)/);
				if(!reg.test(new_password)){
					promptMsg="密码需含有数字与字母！";
					flag=false;
				}
			}
			if(flag){
				$.ajax({
	         		  url: path+"/personal/ajaxUpdatePassword",
	         		  type: "post",		      	  
	         		  async: false,
	         		  data:{id:userId,"oldPassword":old_password,"pwd":new_password},
	         		  dataType: "json",
	         		  timeout: 1000,
	         		  error: function(){},
	         		  success: function(data){ 
	         			  //console.log(data);
	         			  //data=JSON.parse(data);
		         		  if (data.status =="200") {
		         			 $("#cname-error-password").attr("style","display:none;");
		         			 $("#myModal6").hide();
                             successDialog("","修改成功");
		         			 window.location.reload();
		         		  }else{
		         			 promptMsg=data.message;
		         			 flag=false;  			 
		         		  }
	         		 	}
	         	});
			}	
			if(flag){
				//
			}else{
				$("#cname-error-password").attr("style","display:block;color:red;");
				$("#cname-error-password").html(promptMsg);
			}
        });
        $('.bj_btn').click(function(){
            $('.s_name').css('display','none');
            $('.s_input,.qd_btn,.qx_btn').css('display','inline-block');
            $(this).css('display','none');
            $('.s_input_name').val($('#P_name').text());
            $('.s_input_email').val($('#P_email').text());
        })
        function checkEmail(){
    		//用户输入的邮件
    		var email=$('.s_input_email').val();
    		if(email != null && email != ""){
    			//正则表达式
        		var reg=/^(\w)+(\.\w+)*@(\w)+((\.\w+)+)$/;
        		//判断
        		 if(!reg.test(email)){
        			 func_artdialog("提示","请填写正确邮箱");
        		     $('.s_input_email').val(null);
        		     return false;
        		}else{
        			return true;
        		}
    		}
    		return true;
    	}    	
    	function checkName(){
    		var name = $('.s_input_name').val();
    		if(name == null || name == ""){
    			func_artdialog("提示","姓名不能为空");
    			$('.s_input_name').focus();
    			return false;
    		}
    		return true;
    	}
        $('.qd_btn').click(function(){
        	//修改个人资料
        	$(function(){
        		var new_name=$('.s_input_name').val();
        		var new_email=$('.s_input_email').val();       		
        		if(new_name!=null&&new_email!=null&&checkName()&&checkEmail()){
        			$.ajax({
        				url:path+"/personal/ajaxUpdateNameOrEmail",       				
        				 type: "post",       	    		  
        	    		  async: false,
        	    		  data:{id:userId,name:new_name,email:new_email},    	    		  
        	    		  cache:false, 
        	    		  dataType: "json",
        	    		  timeout: 1000,
        	    		  error: function(){},
          	    		  success:function(data){
        	    			  if(data.status == "200"){      	    				  
        	    				  func_artdialog("提示","更新成功"); 
        	    				  window.location.reload();
        	    			  }else{
        	    				  func_artdialog("提示","更新失败");
        	    			  }
        	    		  }
        			});      			
        		}       		
        	});      	
        })
        $('.qx_btn').click(function(){
        	$('.s_name').css('display','inline-block');
        	$('.s_input,.qd_btn,.qx_btn').css('display','none');
        	$('.bj_btn').css('display','inline-block');
        })
      $(function(){  
    	  initDate();
    	   //initDepartment();
      })
      function initDate(){
        	var info=null;
        	 $.ajax({
       		  url: path+"/personal/ajaxUserInfo",
       		  type: "post",   		  
       		  async: false,   		  
       		  dataType: "json",
       		  timeout: 1000,
       		  error: function(){},
       		  success: function(e){  
       			 if(e.status == "200"){
       				 info = e.data;
       				 userId = e.data.sysUser.id;
       			 }
       		}
       	   });      
       	 if(StringEmpty(info)){
       		 setData(info);
			}
        }
      function setData(data){  	  
       	 if (data.sysUser.account!=null&&data.sysUser.account!="") {
  				 $('#old_Phone').text(data.sysUser.account );//为更改弹出框赋值
  				 $('#P_phone').prepend(data.sysUser.account );
  				 $('#login_phone').text(data.sysUser.account);
  				 login_phone=data.sysUser.account;
			}
  			  if (data.sysUser.name!=null&&data.sysUser.name!="") {
  				  $('#P_name').text(data.sysUser.name);
			}   			  
  			  if (data.sysUser.email !=null&&data.sysUser.email !="") {
  				  $('#P_email').text(data.sysUser.email);
			}
  			  			 
  			 if (data.sysRole !=null&&data.sysRole !="") {
  				 var  role = data.sysRole;
  				 
     			  var  P_role ="";
     			  for (var i = 0; i < role.length; i++) {
     				  if(typeof(role[i])!="undefined"&&role[i]!=null){
       				  P_role += role[i].name+"  "; 
     				  }
                   }
     			  $('#P_role').text(P_role);
			}   
  			$("#P_Departments").html(data.departmentName);
  			var names="";
  			var stores=data.stores;
  			for(var i=0;i<stores.length;i++){
    			if(i==stores.length-1){
    				names+=stores[i].name;
    			}else{
  				names+=stores[i].name+"、";
  				}           		
 			}   
  			$("#P_store").html(names);
      }
      /* function initDepartment(){
       	var getDepartmentsUrl=path+"/api/account/getUserDepartment";
        $.post(getDepartmentsUrl,{"cid":cid,"uid":uid},function(data){
	       	if(data.status == 200){
	       		$("#P_Departments").html(data.data);
	       	}else{
	       		$("#P_Departments").html("");
	       	}
        });
        var getStoreUrl=path+"/api/account/getStores";
       $.post(getStoreUrl,{"cid":cid,"id":uid},function(data){
       		//console.log(data);
       		var names="";
        	if(data.status == 200){        		
        		for(var i=0;i<data.data.length;i++){
        			if(i==data.data.length-1){
        				names+=data.data[i].name;
        			}else{
      				names+=data.data[i].name+"、";
      				}           		
     			}          		
       		} 
        	$("#P_store").html(names);
       }); 
     }*/
        //判断字符串是否为空
  	function StringEmpty(content) {
  		if (content == undefined || content == "" || content == null) {
  			return false;
  		} else {
  			return true;
  		}
  	}
  	function func_artdialog(name,value){
 		var d = dialog({
 			title: name,
 			fixed: true,
 			width: 200,
 	        height:100,
 			content:"<center style='font-size:20px; line-height:100px;'>"+value+"</center>",
 			okValue: "确定",
 			ok: function () {
 				return true;
 			}
 		});
 		d.show();
 	}
  	//查看协议
  	function parentAgreement(){
  		$('#updateAgreementBtn', window.parent.document).hide();
  		$('#exitNewBtn', window.parent.document).hide();
        $('#closeBtn', window.parent.document).show();
  		$('#closeAgreementBtn', window.parent.document).show();
  		parent.childAgreement();
  	}
  	
    </script>
    <script type="text/javascript">
    var auths = "<%=session.getAttribute("authoritys")%>";
    </script>
</body>
</html>

